import 'package:appflutterhomeschool/provider/provider_widget.dart';
import 'package:appflutterhomeschool/view_model/academic_sentiment/discount_view_model.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import '../widgets.dart';

class DiscountWidget extends StatefulWidget {
  final Map<String, dynamic> mapScore;
  final GestureTapCallback onTap;

  DiscountWidget({this.mapScore,this.onTap});

  @override
  _DiscountWidgetState createState() => _DiscountWidgetState();
}

class _DiscountWidgetState extends State<DiscountWidget> {
  @override
  Widget build(BuildContext context) {
//    MyAppViewModel myAppViewModel = Provider.of(context);
    return ProviderWidget<DiscountViewModel>(
      model: DiscountViewModel(context, widget.mapScore),
      onModelReady: (value) => value.initView(),
      builder: (context, viewModel, child) {
        return Column(
          children: [
            AcademicItemTitle(title: viewModel.titleText),
            GestureDetector(
              child: AspectRatio(
                aspectRatio: 1.90,
                child: Padding(
                  padding: EdgeInsets.all(ScreenUtil().setWidth(43)),
                  child: Material(
                    borderRadius: BorderRadius.all(Radius.circular(5)),
                    color: Colors.white,
                    elevation: 4.0,
                    child: Padding(
                      padding: EdgeInsets.only(
                          right: 18.0, left: 12.0, top: 24, bottom: 12),
                      child: LineChart(mainData(viewModel)),
                    ),
                  ),
                ),
              ),
              onTap: widget.onTap,
            ),
          ],
        );
      },
    );
  }

  LineChartData mainData(DiscountViewModel viewModel) {
    return LineChartData(
      gridData: FlGridData(
        show: true,
        drawVerticalLine: true,
        getDrawingHorizontalLine: (value) {
          return FlLine(color: Colors.grey[100], strokeWidth: 0.3);
        },
        getDrawingVerticalLine: (value) {
          return FlLine(color: Colors.grey[100], strokeWidth: 0.3);
        },
      ),
      titlesData: FlTitlesData(
        show: true,
        bottomTitles: SideTitles(
          showTitles: true,
          reservedSize: 22,
          textStyle: TextStyle(color: Colors.grey, fontSize: 5),
          getTitles: (value) {
            if (viewModel.time.length > 0) {
              for (int i = 0; i < viewModel.time.length; i++) {
                if (value.toInt() == i && i <= 8) {
                  return viewModel.time[i];
                }
              }
            }
            return '';
          },
          margin: 8,
        ),
        leftTitles: SideTitles(
          showTitles: true,
          textStyle: const TextStyle(
            color: Color(0xff67727d),
            fontSize: 10,
          ),
          getTitles: (value) {
            switch (value.toInt()) {
              case 0:
                return '0';
              case 1:
                return '20';
              case 2:
                return '40';
              case 3:
                return '60';
              case 4:
                return '80';
              case 5:
                return '100';
            }
            return '';
          },
          reservedSize: 11,
          margin: 8,
        ),
      ),
      borderData: FlBorderData(
          show: true, border: Border.all(color: Colors.white, width: 1)),
      minX: 0,
      maxX: 8,
      minY: 0,
      maxY: 6,
      lineBarsData: [
        LineChartBarData(
          spots: viewModel.listFlSpot,
          isCurved: true,
          colors: gradientColors,
          barWidth: 0.5,
          isStrokeCapRound: true,
          dotData: FlDotData(
            show: false,
          ),
          belowBarData: BarAreaData(
            show: true,
            colors:
                gradientColors.map((color) => color.withOpacity(0.1)).toList(),
          ),
        ),
      ],
    );
  }

  List<Color> gradientColors = [
    Colors.blueAccent,
  ];
}
